<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div id="root">

    </div>
    <script src="../Vue2/js/vue.js"></script>
    <script>
        // Vue生命周期诞生了，最终也是会走向消亡的
        const root = new Vue({
            el: '#root', //可以是字符串，也可以是html元素
            // 如果是Vue实例data是对象，如果是组件data是函数
            data: {
                // 数据展示在DOM里面
            },
            methods: {

            },
            //传递生命周期函数
            // 生命周期函数全部都是函数
            beforeCreate() {

            },
            created() {
                // 一般会在里面做一些网络请求
                // 当我们把Vue对象或者组件创建完成之后，就会在这里请求一些数据
                // 把请求到的数据放到data里面
                console.log('执行了生命周期函数');
            },
            created: function () {
                console.log('created');
            },
            mounted: function () {
                console.log('mounted');
            }
            // 上面三个函数都在Vue实例的option对象里面
            // Vue源码通过通过option可以回调调用获取到该函数
            // 在某一时期就会执行上面三个函数

            // 上面三个函数我们并没有调用
            // 我们并没有这样操作
            // created()
            // 是对象内部-Vue源码内部来调用的
            // Vue源码知道我们使用了哪一步            
        })
    </script>
</body>

</html>